<template>
	<view class="msg-login-page">
		
		<view class="msg-img">
			<image :src="actDownMsg.cover_image"></image>
			<!-- <image :src="imglink + 'home/course-details.png'"></image> -->
			<!-- <view>更换表单封面</view> -->
		</view>
		
		<view class="msg-context">
			<view class="msg-text">
				<text>{{actDownMsg.title}}</text>
			</view>
		</view>
		
		<view class="form">
			<view class="form-item" v-for="item in actDownMsg.field" :key='item.store_collect_info_field_id'>
				<view class="msg-tip">{{item.name}}</view>
				<view class="msg-input">
					<input type="text" v-model="item.value" :placeholder="'请输入' + item.name">
					<view class="is-required">
						<image v-if="item.required == 1" :src="imglink + 'member/manage-active_icon_CheckBox_selected.png'" mode=""></image>
						<image v-else :src="imglink + 'member/manage-active_icon_CheckBox_normal.png'" mode=""></image>
						<text style="line-height: 0;margin-top: 14upx;">是否必填</text>
					</view>
				</view>
			</view>
			
		</view>		
		<view class="submit" @click="submitBtn">
			<view>确认</view>
		</view>
		

	</view>
</template>

<script>
	export default{
		data(){
			return {
				imglink: this.$store.state.imgLink,
				sexType:[
					{src:'https://tool.tuanhaoke.cn/static/image/member/manage-active_icon_selected.png',name:'男'},
					{src:'https://tool.tuanhaoke.cn/static/image/member/manage-active_icon_normal.png',name:'女'},
				],
				store_id:"",
				token:'',
				act_down_id:'',
				customer_id:'',
				actDownMsg:{}
			}
		},
		onLoad(options) {
			let share = 1
			this.$store.commit('updataShare', share)
			console.log(options,"路径里面的数据");
			this.customer_id = options.customer_id
			// #ifdef H5
				let pages = getCurrentPages()
				this.currentPge = pages[0].$route.fullPath
			// #endif
			let store_id = parseInt(options.store_id,10);
			console.log('进入了onload 获取url的store_id',store_id)
			if(!store_id > 0){
				store_id = uni.getStorageSync('store_id')?parseInt(uni.getStorageSync('store_id'),10):0
			}else{
				uni.setStorageSync('store_id', store_id)
			}
			let token = options.token;
			console.log('进入了onload 获取url的token',token)
			if(!token){
				token = uni.getStorageSync('token')
			}else{
				uni.setStorageSync('token', token);
			}
			this.token = token
			this.$store.commit('updateToken',token)
			this.store_id = parseInt(store_id,10)
			this.$store.commit('updateStoreId',store_id)
			console.log(this.$store.getters.getToken,'this.$store.getters.getToken')
			if(!this.$store.getters.getToken){
				console.log('111111111')
				// #ifdef H5
					location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + encodeURIComponent(this.currentPge)
				// #endif
				// #ifdef MP-WEIXIN
					userLogin().then((res)=>{
						console.log(res)
						console.log(555555)
					});
				// #endif
			}else{
				this.act_down_id = options.actId
				this.gainDownAct()
			}
			// #ifdef H5
				//  去除分享链接中分享者的token
				const stateObj = this.currentPge
				let pattern = /(&token+.*&)|(&token+.*)/
				this.currentPge = this.currentPge.replace(pattern, '&')
				history.replaceState(stateObj, "", this.currentPge)
			// #endif
			// #ifdef MP-WEIXIN
				let that = this
				uni.login({
					provider: 'weixin',
					success(res) {
						console.log(res,'code');
						that.loginCode = res.code
						that.getTokens(that.loginCode)
					}
				})
			// #endif
		},
		methods:{
			getTokens(code){
				let _selt = this
				uni.request({
					url:_selt.$store.state.URL + '/login/Login/mini_program_login',
					data:{
						code: code,
					},
					method:"POST",
					success(res) {
						console.log(res,'授权登录成功');
						if(res.data.status) {
							_selt.$store.commit('updateToken',res.data.token);
							_selt.gainDownAct()
						}
						console.log('用户登录后的数据',res.data)
					}
				})
			},
			submitBtn(){
				let data = {
					token:this.token,
					field:JSON.stringify(this.actDownMsg.field)
				}
				this.$api.act_down_form(data).than(res => {
					console.log(res)
				}).catch(err => {
					console.log(err)
				})
			},
			gainDownAct(){
				let data = {
					customer_id:this.customer_id,
					store_collect_info_id:this.act_down_id
				}
				console.log(data,"获取线下活动数据需要的数据");
				this.$api.gain_offline_act(data).then(res => {
					console.log(res)
					if(res.status){
						this.actDownMsg = res.list.data[0]
						this.actDownMsg.field.forEach(item => {
							item.value = ''
						})
						console.log(this.actDownMsg,'线下活动数据')
					}
				}).catch(err => {
					console.log(err)
				})
			},
			submitBtn(){
				this.actDownMsg.field.forEach(item => {
					console.log(item)
					if(item.required == 1){
						if(item.value == ''){
							uni.showToast({
								title:'必填信息请输入',
								icon:'none',
								duration:2000
							})
							return false
						}
					}
				})
				let data = {
					token:this.$store.getters.getToken,
					// store_collect_info_id:this.actDownMsg.store_collect_info_id,
					customer_id:this.customer_id,
					form:JSON.stringify(this.actDownMsg)
				}
				this.$api.act_down_form(data).then(res => {
					console.log(res)
					if(res.status){
						uni.showToast({
							title:'信息收集成功',
							icon:'none',
							duration:2000
						})
						setTimeout(()=> {
							uni.redirectTo({
								url: '../../../home/home?store_id=' + this.store_id
							});
						},1000)
					}
				}).catch(err => {
					console.log(err)
				})
			}
		}
	}
</script>

<style>
	.is-required{
		display: flex;
		margin-top: 8upx;
	}
	.is-required>image{
		width: 28upx;
		height: 28upx;
	}
	.is-required>text{
		color: #999999;
		font-size: 22upx;
	}
	page{
		background: #F3F3F4;
	}
	
	.msg-login-page .msg-img{
		position: relative;
		background: #FFFFFF;
	}
	
	.msg-login-page .msg-img image{
		width: 100%;
	}
	

	.msg-login-page .msg-context{
		background: #FFFFFF;
		height: 144upx;
	}
	
	.msg-login-page .msg-context  .msg-text{
		font-size: 30upx;
		height: 84upx;
		width: 690upx;
		padding: 30upx 30upx;
	}
	
	
	.msg-login-page .form{
		margin-top: 20upx;
	}
	
	.form .form-item{
		height: 100upx;
		background: #FFFFFF;
		padding-left: 30upx;
		padding-right: 20upx;
		display: flex;
		line-height: 100upx;
		margin-bottom: 2upx;
	}
	
	.msg-tip{
		color: #666666;
		font-size: 28upx;
		/* letter-spacing: 26upx; */
		flex: 1;
	}
	
	.msg-input>input{
		color: #333333;
		font-size: 28upx;
		flex-grow: 1;
	}
	
	.form-item .msg-tip-telephone{
		letter-spacing: 2upx;
	}
	
	.form-item .msg-input{
		flex: 3;
		margin-top: 30upx;
		color: #999999;
		display: flex;
		justify-content: space-between;
	}
	

	
	.submit{
		height: 100upx;
		width: 600upx;
		margin: 70upx auto 0;
		font-size: 32upx;
		color: #FFFFFF;
		background: linear-gradient(left, #FE9543, #FF664F);
		text-align: center;
		line-height: 100upx;
		border-radius: 44upx;
	}
	
	.sex-child{
		display: flex;
		flex-grow: 1;
	}
	.sex-common image{
		width: 32upx;
		height: 32upx;
		margin-top: 35upx;
	}
	.sex-common{
		display: flex;
		margin-right: 100upx;
	}
	.sex-common>view{
		font-size: 28upx;
		color: #333333;
		margin-left: 10upx;
	}
	
</style>
